//
//  HomeRecommendGoodsTabView.swift
//  iFishApp
//
//  Created by Bob on 2022/3/5.
//

import SwiftUI

struct HomeRecommendGoodsTabView: View {
    @EnvironmentObject var homeVM: HomeViewModel
    @Namespace var animation
    
    var body: some View {
        ZStack(alignment: .trailing) {
            ScrollView(.horizontal, showsIndicators: false) {
                LazyHGrid(rows: Array(repeating: GridItem(.flexible(), spacing: 0), count: 1), spacing: 20) {
                    ForEach(HOME_GOODS_CATEGORY_MODELS, id:\.self) { tab in
                        
                        Button {
                            withAnimation(.spring()) {
                                homeVM.curGoodsCategoryTab = tab
                            }
                        } label: {
                            ZStack(alignment: .bottom) {
                                Text(tab.title)
                                    .font(.system(size: 14))
                                    .foregroundColor(Color.black.opacity(homeVM.curGoodsCategoryTab == tab ? 1 : 0.5))
                                    .frame(maxHeight: .infinity)
                                    .scaleEffect(homeVM.curGoodsCategoryTab == tab ? 1.2 : 1)
                                
                                if homeVM.curGoodsCategoryTab == tab {
                                    Image("home_indicator")
                                        .resizable()
                                        .aspectRatio(contentMode: .fit)
                                        .frame(width: 20)
                                        .matchedGeometryEffect(id: "HOME_GOODS_CATEGORY_ANIMATION", in: animation)
                                } else {
                                    Image("home_indicator")
                                        .resizable()
                                        .aspectRatio(contentMode: .fit)
                                        .frame(width: 20)
                                        .hidden()
                                }
                            }
                        }
                    }
                }
                .frame(height: 40)
                .padding(.leading, 16)
                .padding(.trailing, 60)
                .background(Color.white)
            }
            ZStack(alignment: .trailing) {
                LinearGradient(
                    gradient: Gradient(
                        colors: [
                            Color.white.opacity(0),
                            Color.white,
                            Color.white
                        ]
                    ),
                    startPoint: .leading,
                    endPoint: .trailing
                )
                Image(systemName: "list.dash")
                    .offset(x: -16)
            }
            .frame(width: 76, height: 40)
        }
    }
}

struct HomeRecommendGoodsTabView_Previews: PreviewProvider {
    static var previews: some View {
        HomeRecommendGoodsTabView()
    }
}
